<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>BOM测试</title>
    <style>
        div {
            margin: 10px;
        }
    </style>
</head>

<body>
    <div>
        <button id="btn-show">显示当前网址</button> <br />
        <span id="show-res"></span>
    </div>

    <div>
        <button id="btn-selfurl">跳转到新地址</button>
    </div>

    <div>
        <button id="btn-newurl">打开新页面</button>
    </div>

    <hr />

    <div>
        <button id="btn-timeout">3秒后打开Alert</button>
    </div>

    <hr />

    <div>
        <button id="btn-interval">开启倒计时</button> <br />
        <span style="font-size: 20px; color: red;" id="span-num">10</span>
    </div>

    <hr />

    <div>
        <button id="btn-showtime">显示时间</button> <br />
        <span style="font-size: 20px; color: red;" id="span-time"></span>
    </div>

    <script src="https://cdn.bootcdn.net/ajax/libs/moment.js/2.29.4/moment.min.js"></script>
    <script>
        document.getElementById('btn-show').onclick = function () {
            document.getElementById('show-res').innerHTML = window.location;
        }

        document.getElementById('btn-selfurl').onclick = function () {
            window.location = "https://www.baidu.com";
        }

        document.getElementById('btn-newurl').onclick = function () {
            window.open("https://www.baidu.com");
        }

        document.getElementById('btn-timeout').onclick = function () {
            window.setTimeout(function () {
                let today = moment();
                alert(today.format("YYYY-MM-DD HH:mm:ss"));
            }, 3000);
        }

        document.getElementById('btn-interval').onclick = function () {
            let intervalId = window.setInterval(function () {
                let num = parseInt(document.getElementById('span-num').innerHTML);
                if (num <= 1) {
                    window.clearInterval(intervalId);
                }
                document.getElementById('span-num').innerHTML = num - 1;
            }, 1000);
        }   

        document.getElementById('btn-showtime').onclick = function () {
            window.setInterval(function () {
                let today = moment();
                document.getElementById('span-time').innerHTML = today.format("YYYY年MM月DD日 H时m分s秒");
            }, 1000);
        }   
    </script>
</body>

</html>